<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>浮动场景1：图片与文字环绕</title>
		<style>
			img{
				/* 图片脱离文档流--文字包含在图片周边 */
				float: right;
				margin-right: 50px;/* 图片与文字链接处间隙 */
				margin-bottom: 50px;/*图片与文字链接处间隙*/
			}
			p{
				font-size: 16px;/* 页面默认字体尺寸 */
				line-height: 20px;/* 浮动文字，行高无法设定 */
				word-spacing:20px;
			}
		</style>
	</head>
	<body>
		<h1>浮动之图片环绕</h1>
		<img src="img/2.gif" alt="达丝尼格归笋" width="250px" height="250px" />
		<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Consectetur neque reiciendis libero veritatis. Cumque ullam necessitatibus ipsum commodi dolor sunt praesentium! Enim atque ex qui dolorem rerum libero, dicta eveniet.
		Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptates dicta vitae autem inventore doloremque expedita velit atque eius, omnis nobis natus nulla! Quo nam, dignissimos eveniet quis cupiditate quisquam obcaecati.
		Lorem ipsum dolor sit amet consectetur, adipisicing elit. Neque illum doloremque dolorem ipsam doloribus nostrum ipsum harum officia labore maiores, vero a consequuntur optio eum iure autem ullam reprehenderit voluptas.
		</p>
	</body>
</html>